<!--
 * @Date: 2024-10-21 10:11:20
 * @Author: LiSong
 * @LastEditors: LiSong
 * @LastEditTime: 2025-04-11 14:36:19
 * @Description: 表格的方法
-->

<template>
  <el-form-item label="onCellClick" label-width="150px">
    <el-button
      :="btnAttrs"
      @click="editEventHandler('onCellClick', baseEventParams)">
      {{i18nt('designer.setting.addEventHandler')}}
    </el-button>
  </el-form-item>
  <el-form-item label="onCurrentChange" label-width="150px">
    <template #label>
      <span>
        <span>onCurrentChange</span>
        <el-tooltip effect="light" content="只对【表格行配置->高亮当前行(鼠标点击行)】开启时有效，当手动选中行并且值发生改变时触发的事件！">
          <VfIcon name="iv-icon-info" />
        </el-tooltip>
      </span>
    </template>
    <el-button :="btnAttrs" :type="editEventButtonType('onCurrentChange')" 
      @click="editEventHandler('onCurrentChange', baseEventParams)">
      {{i18nt('designer.setting.addEventHandler')}}
    </el-button>
  </el-form-item>
  <el-form-item label-width="150px">
    <template #label>
      <span>
        <span>{{ toolbarBtns.funcName }}</span>
        <el-tooltip effect="light" content="只对【工具栏配置->功能按钮配置】存在数据时有效！">
          <VfIcon name="iv-icon-info" />
        </el-tooltip>
      </span>
    </template>
    <el-button :="btnAttrs" :type="editEventButtonType(toolbarBtns.funcName)" 
      @click="editEventHandler(toolbarBtns.funcName, toolbarBtns.paramsName)">
      {{i18nt('designer.setting.addEventHandler')}}
    </el-button>
  </el-form-item>
  <el-form-item :label="operateCol.funcName" label-width="150px">
    <el-button :="btnAttrs" :type="editEventButtonType(operateCol.funcName)" 
      @click="editEventHandler(operateCol.funcName, operateCol.paramsName)">
      {{i18nt('designer.setting.addEventHandler')}}
    </el-button>
  </el-form-item>
</template>

<script>
import i18n from "@/utils/i18n"
import eventMixin from "@/components/form-designer/setting-panel/property-editor/event-handler/eventMixin"

export default {
  name: "onTableFunc-editor",
  mixins: [i18n, eventMixin],
  props: {
    designer: Object,
    selectedWidget: Object,
    optionModel: Object,
  },
  data() {
    return {
      // 按钮的属性
      btnAttrs: {
        type: 'info',
        icon: 'el-icon-edit',
        plain: true,
        round: true
      },
      // 操作列方法参数
      operateCol: {
        funcName: 'onOperateButtonsClick',
        paramsName: ['btnItem', 'row', 'tableName']
      },
      // 工具栏方法参数
      toolbarBtns: {
        funcName: 'onTableButtonsClick',
        paramsName: ['btnItem', 'checkedRows', 'tableName']
      },
      // 通用方法参数
      baseEventParams: ['row', 'rowIndex', 'column', 'columnIndex'],
    }
  },
  mounted() {
  },
  methods: {
  }
}
</script>

<style scoped>
</style>
